<template>
  <div class="login">
    <div class="login-img">
      <img class="login-img-1" src="../../static/login/4.png" alt="">
      <div class="login-1">
        請鏈接錢包進行簽名登陸
      </div>
      <div class="login-2" @tap="loginMsg">
        鏈接錢包
      </div>
      <div class="login-3">
        注:需切换至幣安公鏈網絡
      </div>
    </div>
  </div>
</template>

<script setup>
import {ref,reactive,onMounted} from "vue";
import {login} from "../../api/login";
import web3 from '../../web3-config';

let account = ref(null);
let balance = ref(null);

let queryInfo = reactive({})
const loginMsg =  async ()=>{
  try {
    if(window.ethereum){
      const accounts =await window.ethereum.request({ method: 'eth_requestAccounts' });
      account.value = accounts[0];
      uni.setStorageSync('Account',account.value);
      queryInfo.wallet_addr = account.value;
      if(account.value){
        login(queryInfo).then(res=>{
          if(res.data.code === 200){
            const deviceCode = res.data.data;
            uni.switchTab({
              url: '/pages/index/home'
            })
          }else{
            uni.showToast({
              title: 'error',
              icon: 'error',
            })
          }
        })
      }
    }
  }catch (e){}
}

const sendEther = async () => {
  if (window.ethereum) {
    const toAddress = '0xC978c5A9De1A0a2b35A74b93f4B2B8d328c2A541'; // 收款人地址
    const value = '0.1'; // 转账金额，单位为ether
    try {
      const txHash = await sendTransaction(toAddress, value);
      console.log('交易已发送，交易哈希：', txHash);
    } catch (error) {
      console.error('发送交易时出错：', error);
    }
  } else {
    alert('请先连接钱包！');
    await connectMetaMask();
  }
};

const connectMetaMask = async () => {
  try {
    const accounts = await window.ethereum.request({ method: 'eth_requestAccounts' });
    return accounts[0]; // 返回用户账户地址
  } catch (error) {
    console.error('连接MetaMask失败:', error);
  }
};

const sendTransaction = async (toAddress, value) => {
  try {
    const fromAddress = await connectMetaMask(); // 获取用户账户地址
    let gasPrice = await web3.eth.getGasPrice();
    let nonce = await web3.eth.getTransactionCount(fromAddress);
    console.log(fromAddress);
    const transactionParameters = {
      from: fromAddress,
      to: toAddress,
      gasPrice: gasPrice,
      nonce: nonce,
      value: web3.utils.toHex(web3.utils.toWei(value, 'ether')),
      gas: 21000
    };

    const txHash = await window.ethereum.request({
      method: 'eth_sendTransaction',
      params: [transactionParameters],
    });
    return txHash;
  } catch (error) {
    console.error('发送交易失败:', error);
  }
};
</script>


<style scoped>
.login{
  background-color:#FFFFFF;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 100vh;
  min-height: 100vh;
  display: flex;
  justify-content: center;

}
.login-img{

}
.login-img-1{
  width: 200px;
  display: flex;
  margin: 0 auto;
  padding: 15vh  0 5vh 0;
  box-sizing: border-box;
}
.login-1{
  width: 90vw;
  text-align: center;

}
.login-2{
  margin: 20vh 0 2vh 0;
  box-sizing: border-box;
  width: 90vw;
  background: #2A54A0;
  color: #FFFFFF;
  text-align: center;
  border-radius: 2vw;
  font-size: 2vh;
  padding: 1vh 0;
}
.login-3{
  width: 90vw;
  height: 5vh;
  line-height: 5vh;
  color: red;
  text-align: center;
  border-radius: 2vw;
  font-size: 1.5vh;

}
</style>